// @flow
import * as React from 'react';
import {useEffect} from 'react';
import {Button, Col, Row, Typography} from "antd";
import {useDispatch} from "react-redux";
import {queryHome} from "../../store/home/slice";
import {queryCategories} from "../../store/categories/slice";
import {Advertise} from "./components/advertise";
import {Product} from "./components/product";
import {BrandPartners} from "./components/brandPartners";
import {Category} from "./components/category";
import {useSelector} from "../../store/hook";
import {queryProduct} from "../../store/product/slice";

/**
 * 描述：网站首页
 * 作者：刘飞华
 * 日期：2024/3/29 15:21
 */
export const HomePage = () => {
    const dispatch = useDispatch()

    useEffect(() => {
        dispatch(queryHome())
    }, []);

    useEffect(() => {
        dispatch(queryCategories())
    }, []);


    const data = useSelector(s => s.home.data)
    // const productList = useSelector(s => s.product.data)

    return (
        <>
            <Row style={{marginTop: 20}}>
                <Col span={6}>
                    <Category/>
                </Col>
                <Col span={18}>
                    <Advertise/>
                </Col>
            </Row>
            <Product
                title={
                    <Typography.Title level={3} type="success">
                        限时秒杀
                    </Typography.Title>
                }

                products={data.homeFlashPromotion.productList}/>
            <Product
                title={
                    <Typography.Title level={3} type="danger">
                        爆款推荐
                    </Typography.Title>
                }

                products={data.hotProductList}/>
            <Product
                title={
                    <Typography.Title level={3} type="warning">
                        新品推荐
                    </Typography.Title>
                }

                products={data.newProductList}/>

            <BrandPartners/>
        </>
    );
};
